<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>


    <title>E.D.D.I | Conversational Interface</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="theme-color" content="#3C5EA6">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="white">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@">
    <meta name="twitter:creator" content="@">
    <meta name="twitter:title" content="">
    <meta name="twitter:description" content="">
    <meta name="twitter:image" content="/binary/img/logo_high.png">
    <link rel="icon" href="/binary/img/logo_high.png" class="js-favicon">
    <link rel="apple-touch-icon" sizes="152x152" href="">
    <link rel="apple-touch-icon" sizes="120x120" href="/binary/img/logo_high.png">
    <link rel="apple-touch-icon" sizes="76x76" href="/binary/img/logo_high.png">
    <link rel="apple-touch-icon" sizes="60x60" href="/binary/img/logo_high.png">
    <link rel="mask-icon" href="/binary/img/logo_high.png" color="#3C5EA6">

    <!-- Open Graph data -->
    <meta property="og:title" content="E.D.D.I | Conversational Interface">
    <meta property="og:url" content="https://eddi.labs.ai">
    <meta property="og:description" content="">
    <meta property="og:site_name" content="E.D.D.I | Conversational Interface">
    <meta property="og:image" content="/binary/img/logo_high.png">
    <meta name="og:locale" content="de_AT">
    <meta name="fb:admins" content="">
    <meta name="og:type" content="website">

    <!-- Site Verifications -->
    <link rel="shortcut icon" href="/binary/img/logo_high.png" type="image/x-icon">
    <link rel="icon" href="/binary/img/logo_high.png" type="image/x-icon">
    <link rel="shortcut icon" href="/binary/img/logo_high.png">

    <!--  Stylesheets -->
    <link rel="stylesheet" type="text/css" media="all" href="/text/css/chat2.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
          integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">

    <!-- Custom fonts for this template -->
    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">

    <!--   Scripts  -->
    <script type="text/javascript" src="/text/js/chat2.js"></script>
</head>

<body>
<div id="chat-container" class="container spacer animated fadeIn">
    <div id="debug-container">
        <div>
            <h1>Debug Options</h1>
            <div class="container spacer" style="display: block;">
                <label for="contextValue">Context JSON:</label>
                <br>
                <textarea id="contextValue"
                          name="contextValue"
                          placeholder="context to be send..."
                          rows="6" cols="50"></textarea>
                <br>
                <br>
                <br>
                <br>
                <button class="btn" type="button" onclick="eddi.insertContextExample()">
                    <span>Insert Example</span>
                </button>
            </div>
            <div class="container spacer" style="display: block;">
                <div>
                    <p>
                        <a id="previousConversationLink" href="#" target="_blank" style="display: none;">
                            Previous Conversation
                        </a>
                    </p>
                    <div id="previousConversationId">

                    </div>
                </div>
                <br/>
                <div>
                    <a id="currentConversationLink" href="#" target="_blank">
                        Current Conversation
                    </a>
                    <div id="currentConversationId">

                    </div>
                </div>
                <br/>
                <button class="btn" type="button" onclick="eddi.createConversation(eddi.environment, eddi.botId, true)">
                    <span>New Conversation</span>
                </button>
                <div>
                    <input type="checkbox" id="skipDelay" name="skipDelay" value="Skip Delay"> Skip Output Delay
                    Animation<br>
                </div>
            </div>
        </div>
    </div>
    <img id="eddiLogo" class="chatImg" src="/binary/img/logo_high.png" alt="Differ Bot image"/>
    <span id="welcomeMsg"></span>
</div>

<div id="container" class="container spacer">
    <div id="about-container" class="container spacer animated fadeIn displayOff">
        <div class="container spacer animated ">
            <div class="section">
                <img src="/binary/img/logo_high.png" alt="E.D.D.I Logo">
                <p>
                    <a target="_blank" title="E.D.D.I Website" href="https://eddi.labs.ai">
                        E.D.D.I
                    </a>

                    is maintained by

                    <a target="_blank" title="LABS.AI Website" href="https://www.labs.ai">
                        LABS.AI
                    </a>
                </p>
                <p>
                <div>
                    <script type="text/javascript" language="javascript">
                        <!--
                        // Email obfuscator script 2.1 by Tim Williams, University of Arizona
                        // Random encryption key feature coded by Andrew Moulden
                        // This code is freeware provided these four comment lines remain intact
                        // A wizard to generate this code is at http://www.jottings.com/obfuscator/
                        {
                            const coded = 'OeKQXOQ@zXkT.XR';
                            const key = 'kin7e1uTGVcyMSXwRKY4tfZUhOl3Aq96ELgQDFx5JzIN0WjbpdvomPsC2H8Bra';
                            const shift = coded.length;
                            let link = '';
                            let ltr;
                            for (let i = 0; i < coded.length; i++) {
                                if (key.indexOf(coded.charAt(i)) === -1) {
                                    ltr = coded.charAt(i);
                                    link += (ltr)
                                } else {
                                    ltr = (key.indexOf(coded.charAt(i)) - shift + key.length) % key.length;
                                    link += (key.charAt(ltr))
                                }
                            }
                            document.write('<a href="mailto:' + link + '">Get in Touch</a>');
                        }
                        //-->
                    </script>
                    <noscript>Sorry, you need Javascript on to email me.</noscript>

                </div>
            </div>
        </div>

    </div>
    <div class="displayNone" id="menu">
        <ul>
            <li id="chat" class="active">
                <a href="#chat-container">
                    <i class="far fa-comments fa-3x" style="margin-top: 5px"></i>
                    <div style="padding-top: 3px">Chat</div>
                </a>
            </li>
            <li id="about">
                <a href="#about-container">
                    <i class="fas fa-info-circle fa-3x" style="margin-top: 5px"></i>
                    <div style="margin-top: 3px">About</div>
                </a>
            </li>
            <li id="debug">
                <a href="#chat-container">
                    <i class="fas fa-toolbox fa-3x" style="margin-top: 5px"></i>
                    <div style="margin-top: 3px">Debug</div>
                </a>
            </li>
        </ul>
    </div>
    <!--suppress ES6ConvertVarToLetConst -->
    <script type="text/javascript">
        function isIE() {
            var ua = window.navigator.userAgent;
            var msie = ua.indexOf('MSIE '); // IE 10 or older
            var trident = ua.indexOf('Trident/'); //IE 11

            return (msie > -1 || trident > -1);
        }

        if (isIE()) {
            alert('Internet Explorer is not supported, please use another browser (e.g. Chrome, Firefox, Safari, Edge).')
        }
    </script>
    <noscript>
        <div class="noJS noJSText">
            <i class="fa fa-exclamation-triangle fa-3x"></i>
            E.D.D.I can't run without JavaScript. Click <a href="https://enable-javascript.com/"
                                                           title="Learn how to enable JavaScript on your browser"
                                                           target="_blank">here</a> to learn more.
        </div>
    </noscript>
</div>
</body>
</html>
